/**
  * @name      : tips
  * @explain   : 操作提示
  * @type      : 基类
  * @dependent : 无
  * @author    : joinli
  * @version   : 1.0
  * @html      :

    <div class="tips">
      <span class="tips-ico"><span class="ico-ok"><!-- 图标 --></span></span>
      <div class="tips-content">
        <div class="tips-title">提示标题</div>
        <div class="tips-line">提示描述</div>

        <div class="tips-buttons">
          <a class="btn-white" href="#"><span>按钮</span></a>
          <a href="#">链接</a>
        </div>
      </div>
    </div>
  */
*html{background-image:url(about:blank);background-attachment:fixed;}
#box{
	top:100px;
	position:fixed;
    _position:absolute;
    _bottom:auto;
    _top:expression(eval(document.documentElement.scrollTop+100));
}
.box .ico-ok, .box .ico-error, .box .ico-info, .box .ico-question, .box .ico-question-s, .box .ico-warn, .box .ico-wait{background:url(box.png) no-repeat;display:inline-block;width:32px;height:32px;}
.box .ico-ok{background-position:-66px 0;}
.box .ico-error{background-position:0 0;}
.box .ico-info{background-position:-33px 0;}
.box .ico-question{background-position:-99px 0;}
.box .ico-warn{background-position:-165px 0;}
.box .ico-wait{background-position:-132px 0;}

.box .tips{padding:34px 0 0;}
.box .tips-ico{float:left;position:relative;top:-9px;width:auto;padding-left:5%;margin-right:16px;_margin-right:13px;text-align:right;}
.box .tips-content{overflow:hidden;height:1%;padding-right:5%;}
.box .tips-title, .box .tips-line{padding:0 0 8px;}
.box .tips-title{font-weight:700;font-size:14px;}
.box .tips-line{line-height:20px;}
.box .tips-line .error-code{position:relative;display:inline-block;vertical-align:top;padding-right:26px;color:#999999;}
.box .tips-line .error-code .ico-question-s{position:absolute;right:0;top:2px;_top:3px;cursor:help;}
.box .font-red{color:#c00;}
.box .tips-buttons{margin-top:20px;}
.box .tips-buttons .btn-blue, .box .tips-buttons .btn-blue-s, .box .tips-buttons .btn-white, .box .tips-buttons .btn-white-s{margin-right:16px;}


/**
  * @name      : tips-mini
  * @explain   : 迷你ico操作提示
  * @type      : 扩展类
  * @dependent : tips
  * @author    : joinli
  * @version   : 1.0
  * @html      :

    <div class="tips tips-mini">
      <span class="tips-ico"><span class="ico-ok-s"><!-- 图标 --></span></span>
      <div class="tips-content">
        <div class="tips-title">提示标题</div>
        <div class="tips-line">提示描述</div>

        <div class="tips-buttons">
          <a class="btn-white-s" href="#"><span>按钮</span></a>
          <a href="#">返回</a>
        </div>
      </div>
    </div>
  */
.box .tips-mini .ico-ok, .box .tips-mini .ico-error, .box .tips-mini .ico-info, .box .tips-mini .ico-question, .box .ico-question-s, .box .tips-mini .ico-warn, .box .tips-mini .ico-wait{width:16px;height:16px;}
.box .tips-mini .ico-ok{background-position:-232px 0;}
.box .tips-mini .ico-error{background-position:-198px 0;}
.box .tips-mini .ico-info{background-position:-215px 0;}
.box .tips-mini .ico-question, .box .ico-question-s{background-position:-198px -16px;}
.box .tips-mini .ico-warn{background-position:-232px -16px;}
.box .tips-mini .ico-wait{background-position:-215px -16px;}

.box .tips-mini{padding-top:25px;}
.box .tips-mini .tips-ico{top:0;margin-right:10px;_margin-right:7px;}
.box .tips-mini .tips-title{font-size:12px;}
.box .tips-mini .tips-line{line-height:18px;}


/**
  * @name      : box
  * @explain   : 弹出层
  * @type      : 基类
  * @dependent : 无
  * @author    : joinli
  * @version   : 1.0
  * @html      :
  */
p,h2{margin:0;padding:0;}
.box .btn-close, .box .btn-close-b{background:url(box.png) no-repeat;}
.box{position:relative;height:100%;*width:100%;margin:-5px;padding:6px;font-size:12px;line-height:1.5;background-color:rgba(0,0,0,0.1);filter:progid:DXImageTransform.Microsoft.Gradient(startColorstr=#30000000, endColorstr=#30000000);}
.box .btn-close{background-position:-286px 0;position:absolute;z-index:1;right:13px;top:13px;width:16px;height:16px;overflow:hidden;text-indent:-99em;text-decoration:none;}
.box .btn-close:hover{background-position:-302px 0;}
.box .btn-close-b{background-position:-249px 0;position:absolute;z-index:1;right:10px;_right:19px;top:10px;width:18px;height:18px;overflow:hidden;text-indent:-99em;text-decoration:none;}
.box .btn-close-b:hover{background-position:-267px 0;}
.box-title{position:relative;border:1px solid #369;border-bottom:none;margin:-1px -1px 0;background-color:#EBF2FA;padding:1px 0;}
.box-title h2{height:2em;line-height:2em;color:#666;font-size:100%;text-indent:12px;}
.box-main{position:relative;background-color:#fff;border:1px solid #369;margin:0 -1px -1px;border-top:none;zoom:1;}
.box-buttons{margin-top:23px;padding:0 9px 9px 0;text-align:right;}
.box-buttons button{margin-left:8px;min-width:68px;min-width:52px\9;*min-width:auto;height:24px;padding:0 5px 1px;*padding:0 10px 1px;}
.box iframe.box-iframe, .box-loading{position:relative;height:100%;width:100%;margin:-1px;overflow:hidden;border:1px solid #6685A2;background-color:#FFFFFF;}
.box-loading{display:none;}
.box-loading .ico-loading-16{position:absolute;left:50%;top:50%;margin:-8px 0 0 -60px;}
.show-box-loading .box-loading{display:block;}
.show-box-loading iframe.box-iframe{width:0;height:0;}


/**
  * @name      : box-mini
  * @explain   : 迷你弹出层
  * @type      : 扩展类
  * @dependent : box
  * @author    : joinli
  * @version   : 1.0
  * @html      :
  */
.box-mini{width:400px;}
.box-mini .box-buttons{margin-top:12px;}